﻿

<h2>
    Log On</h2>



<head runat="server">
    <title>ASP.Net Facebook Integration</title>

    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript">
</script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"
   type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/openid-jquery.js")"
   type="text/javascript"></script>
    <script src="scripts/jquery-1.8.0.min.js" type="text/javascript"></script>
    <script src="scripts/all.js" type="text/javascript"></script>    
    <script type="text/javascript">
        $("document").ready(function () {
            // Initialize the SDK upon load
            FB.init({
                appId: '157109591103834', // App ID         
                scope: 'id,name,gender,user_birthday,email', // This to get the user details back from Facebook
                status: true, // check login status
                cookie: true, // enable cookies to allow the server to access the session
                xfbml: true  // parse XFBML
            });
            // listen for and handle auth.statusChange events
            FB.Event.subscribe('auth.statusChange', OnLogin);
        });

        // This method will be called after the user login into facebook.
        function OnLogin(response) {
            if (response.authResponse) {
                FB.api('/me?fields=id,name,gender,email,birthday', LoadValues);                    
            }
        }

        //This method will load the values to the labels
        function LoadValues (me) {
            if (me.name) {
                document.getElementById('displayname').innerHTML = me.name;
                document.getElementById('FBId').innerHTML = me.id;
                document.getElementById('DisplayEmail').innerHTML = me.email;
                document.getElementById('Gender').innerHTML = me.gender;
                document.getElementById('DOB').innerHTML = me.birthday;
                document.getElementById('auth-loggedin').style.display = 'block';
                            }
        }
    </script>
</head>

<body>
<form action=
"Authenticate?ReturnUrl=@HttpUtility.UrlEncode(Request.QueryString["ReturnUrl"])"
 method="post" id="openid_form">
<input type="hidden" name="action" value="verify" />
<div>
    <fieldset>
        <legend>Login using OpenID</legend>
        <div class="openid_choice">
            <p>
                Please click your account provider:</p>
            <div id="openid_btns">
            </div>
        </div>
        <div id="openid_input_area">
            @Html.TextBox("openid_identifier")
            <input type="submit" value="Log On" />
        </div>
        <noscript>
            <p>
                OpenID is service that allows you to log-on to many different websites 
                using a single indentity. Find out <a href="http://openid.net/what/">
                 more about OpenID</a>and <a href="http://openid.net/get/">
                 how to get an OpenID enabled account</a>.</p>
        </noscript>
        
    </fieldset>
</div>
</form>


    <div id="fb-root"></div> <!-- This initializes the FB controls-->   
    <div class="fb-login-button" autologoutlink="true" scope="user_birthday,email" >
      Login with Facebook
     </div> <!-- FB Login Button -->   
    <!-- Details --> 
    <div id="auth-status">    
    <div id="auth-loggedin">
        Hi, <span id="displayname"></span><br/>
        Your Facebook ID : <span id="FBId"></span><br/>
        Your Email : <span id="DisplayEmail"></span><br/>
        Your Sex:, <span id="Gender"></span><br/>
        Your Date of Birth :, <span id="DOB"></span><br/>        
    </div>
    </div>
</body>

